<template>
    <div class="TextareaView" style="width: 300px; padding: 5px 0 0 67px">
        <a-select class="selectView" style="width: 130px" size="small" v-model:value="Event.ValueType" @change="ValueTypeChange">
            <a-select-option v-for="Value in ValueArray" :value="Value.key">{{ Value.name }}</a-select-option>
        </a-select>
        <span v-if="Event.ValueType == 'function'" style="padding: 0 0 0 5px"> (Val,Form) {</span>
        <div style="width: 300px; padding: 5px 0 0 0">
            <a-input v-if="Event.ValueType == 'direct'" addon-before="= " v-model:value="Event.Value"></a-input>
            <a-textarea v-if="Event.ValueType == 'function'" v-model:value="Event.Value"></a-textarea>
        </div>
        <div class="TextView"><span v-if="Event.ValueType == 'function'">}</span></div>
    </div>
</template>
<script setup>
import { reactive } from "vue";
const props = defineProps(["Event"]);
const ValueArray = reactive([
    { name: "表达式", key: "direct" },
    { name: "async function", key: "function" },
]);
const ValueTypeChange = (Value) => {
    if (Value == "direct") {
        props.Event.Value = "";
    } else {
        props.Event.Value = "\n  return ''";
    }
};
</script>
<style lang="less" scoped></style>
